<template>
  <div class="communityOrderList padding_20">
    <el-input v-model="param.name"
              placeholder="商品名称"
              @clear="handleQuery"
              class="input_1"
              clearable/>
    <el-datePicker type="date"
                   v-model="param.startTime"
                   placeholder="起始日期"
                   value-format="yyyy-MM-dd"
                   @change="handleQuery"
                   class="datePicker_1"></el-datePicker>
    <el-datePicker type="date"
                   v-model="param.endTime"
                   value-format="yyyy-MM-dd"
                   placeholder="截止日期"
                   @change="handleQuery"
                   class="datePicker_1"></el-datePicker>
    <el-button type="primary"
               @click="handleQuery">查询
    </el-button>
    <Table :columns="tableCol"
           :data="tableData"
           stripe
           border
           class="mt-20">
      <template slot-scope="{row}"
                slot="action">
        <span @click="handleView(row)">详细</span>
      </template>
    </Table>
    <page @getList="_getList"
          :pageTotal="pageTotal"
          ref="page"></page>
  </div>
</template>

<script>

import Page from '@/base/page/page'
import {mapGetters} from 'vuex'
import {orderMgt} from '@/api/codeName'

export default {
  name: "communityOrderList",
  data() {
    return {
      tableCol: [
        {
          type: 'index2',
          title: '',
          width: 60,
          render: (h, params) => {
            return h('span', params.index + (this.page.pageIndex) * this.page.pageSize + 1);
          }
        },
        {
          title: '检测项目',
          key: 'checkName',
        },
        {
          title: '金额（元）',
          key: 'money',
        },
        {
          title: '解读医生',
          key: 'dname'
        },
        {
          title: '订单来源',
          key: 'channelName'
        },
        {
          title: '患者信息',
          key: 'memberDto',
          render: (h, params) => {
            return h(
              'span', {},
              [
                h('span', {attrs: {style: 'margin-right:20px'}}, `${params.row.name}`),
                h('span', {attrs: {style: 'margin-right:20px'}}, `${params.row.sex == 1 ? '男' : '女'}`),
                h('span', {attrs: {style: 'margin-right:20px'}}, `${Math.floor(this.commonFunction.checkAge(params.row.age, params.row.createTime))}岁`)
              ]
            )
          }
        },
        {
          title: '状态',
          key: 'status',
          render: (h, params) => {
            return h('span', params.row.status ? '已解读' : '未解读');
          }
        },
        {
          title: '创建时间',
          key: 'createTime',
          width: 150,
          render: (h, params) => {
            return h('span',
              this.commonFunction.timestampFormat(new Date(params.row.createTime), 'yyyy-MM-dd hh:mm'));
          }
        },
        {
          title: '操作',
          slot: 'action',
          align: 'center'
        }
      ],
      tableData: [],
      pageTotal: 0,       //总条数
      wdStudioTypeList: [],
      hospitalList: [],
      loading: false,
      param: {
        name: '',
        startTime: '',
        endTime: ''
      }
    }
  },
  mounted() {
    if (this.params.communityOrderMgt) {
      this.param = this.params.communityOrderMgt
    } else {
      this.$store.commit('SET_PARAMS', {communityOrderMgt: this.param})
    }
    this._getList()
  },
  methods: {
    handleQuery() {
      this.page.pageIndex = 0
      this._getList()
    },
    handleView(row) {
      this.$router.push({name: 'communityOrderView', query: {id: row.id}})
    },
    _getList() {
      this.ajax({
        type: this.api.communityOrderList.type,
        url: this.api.communityOrderList.url,
        data: Object.assign({}, this.page, this.param),
        success: (data) => {
          this.tableData = data.object
          this.pageTotal = data.totalNum
          this.$previewRefresh()
        },
        error: (data) => {
          this.$Message.error(data.message);
        }
      })
    }
  },
  computed: {
    ...mapGetters([
      'page',
      'params'
    ])
  },
  components: {
    Page
  }
}
</script>

<style lang="scss" type="text/scss" rel="stylesheet/scss">
.communityOrderList {
}
</style>
